<template>
  <view class="page">
    <!-- 基本信息 -->
    <view class="section">
      <view class="section-title">基本信息</view>
      <view class="info-item">
        <text class="label">姓名：</text>
        <text class="value">{{ userInfo.name }}</text>
      </view>
      <view class="info-item">
        <text class="label">性别：</text>
        <text class="value">{{ userInfo.gender }}</text>
      </view>
      <view class="info-item">
        <text class="label">出生日期：</text>
        <text class="value">{{ formatDate(userInfo.birthday) }}</text>
      </view>
      <view class="info-item">
        <text class="label">籍贯：</text>
        <text class="value">{{ userInfo.nativePlace }}</text>
      </view>
      <view class="info-item">
        <text class="label">民族：</text>
        <text class="value">{{ userInfo.ethnicity }}</text>
      </view>
    </view>

    <!-- 联系信息 -->
    <view class="section">
      <view class="section-title">联系信息</view>
      <view class="info-item">
        <text class="label">紧急联系人：</text>
        <text class="value">{{ userInfo.emergencyContact }}</text>
      </view>
      <view class="info-item">
        <text class="label">紧急联系电话：</text>
        <text class="value">{{ userInfo.emergencyContactPhone }}</text>
      </view>
    </view>

    <!-- 工作信息 -->
    <view class="section">
      <view class="section-title">工作信息</view>
      <view class="info-item">
        <text class="label">护工编号：</text>
        <text class="value">{{ userInfo.archiveCode }}</text>
      </view>
      <view class="info-item">
        <text class="label">等级：</text>
        <text class="value">{{ userInfo.level }}</text>
      </view>
      <view class="info-item">
        <text class="label">服务状态：</text>
        <text class="value">{{ userInfo.serviceStatus }}</text>
      </view>
      <view class="info-item">
        <text class="label">服务类型：</text>
        <text class="value">{{ userInfo.serviceType }}</text>
      </view>
      <view class="info-item">
        <text class="label">服务标签：</text>
        <text class="value">{{ userInfo.serviceLabel }}</text>
      </view>
      <view class="info-item">
        <text class="label">入职时间：</text>
        <text class="value">{{ formatDate(userInfo.workTime) }}</text>
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref, onMounted } from 'vue'

const userInfo = ref({})

// 格式化日期显示
const formatDate = (dateString) => {
  if (!dateString) return ''
  const date = new Date(dateString)
  return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`
}

onMounted(() => {
  const storedUserInfo = uni.getStorageSync('nurseuserInfo')
  if (storedUserInfo) {
    userInfo.value = JSON.parse(storedUserInfo)
  }
})
</script>

<style scoped lang="scss">
.page {
  padding: 20rpx;
}

.section {
  margin-bottom: 30rpx;
  padding: 20rpx;
  background-color: #fff;
  border-radius: 16rpx;
  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
}

.section-title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 20rpx;
}

.info-item {
  display: flex;
  align-items: center;
  padding: 10rpx 0;
  font-size: 28rpx;
}

.label {
  color: #666;
  min-width: 150rpx;
}

.value {
  color: #333;
  flex: 1;
}
</style> 